import React from "react";
import { SearchBar } from 'antd-mobile';
class SearchBarExample extends React.Component {
    state = {
        value: '',
    };
    onChange = (value) => {
        this.setState({ value });
    };
    clear = () => {
        let {clear}=this.props;
        this.setState({ value: '' });
         clear();
    };
    render() {
        let { getSearchList } = this.props
        return (
            <SearchBar
                onClear={this.clear}
                showCancelButton="true"
                value={this.state.value||""}
                placeholder="Search"
                onSubmit={value => getSearchList(value)}
                onCancel={() => (this.props.history.go(-1))}
                cancelText="取消"    
                onChange={this.onChange}
            />
        );
    }
    componentDidMount() {
        this.setState({ value: this.props.keywrod });
    }
    componentWillUpdate(nextProps) {
        if (nextProps.keywrod !== this.props.keywrod) {
            this.setState({ value: nextProps.keywrod });
        }
    }
}
export default SearchBarExample;
